<template>
	<view class="conter">
		<header-box :title="title"></header-box>

		<view class="conter-text">
			<view class="bgc">
				<!-- <view class="text-heig" @click="show = true">
					<text>日期</text>
					<u-icon name="arrow-down-fill" color="#999999" size="28"></u-icon>
				</view> -->
				<view class="shop-heig">
					<text>商品</text>
					<view class="">
						<input type="text" v-model="shoppinName" placeholder="请输入商品名称" />
					</view>
				</view>
				<!-- <view class="text-heig" @click="showNum = true">
					<text>数量</text>
					<u-icon name="arrow-right" color="#999999" size="28"></u-icon>
				</view> -->
				<navigator url="/pages/shopping/select" class="text-heig">
					<text>单位</text>
					<view class="">
						{{monad}}
						<u-icon name="arrow-right" color="#999999" size="28"></u-icon>
					</view>
				</navigator>
				<!-- <navigator url="/pages/shopping/stock" class="text-heig">
					<text>仓库</text>
					<u-icon name="arrow-right" color="#999999" size="28"></u-icon>
				</navigator> -->
				<!-- <navigator url="/pages/shopping/classShopp" class="text-heig">
					<text>{{className}}</text>
					<u-icon name="arrow-right" color="#999999" size="28"></u-icon>
				</navigator> -->
				<view class="left-box">
					<text>商品图片</text>
					<view class="" style="margin-top: 20rpx;">
						<u-upload max-count="1" @on-success="goodsImage" :action="action" width="200rpx" height="200rpx" :file-list="fileList"></u-upload>
					</view>
				</view>
			</view>
		</view>

		<view class="add bg-gradual-green" @click="addShopping">
			确定添加
		</view>





	</view>
</template>

<script>
	import headerBox from '../../components/header/header.vue'

	export default {
		components: {
			headerBox
		},
		data() {
			return {
				title: '添加商品',
				showNum: false,
				show: false,
				mode: 'date',
				monad: '请选择单位',
				action: this.$IMG_URL,
				// pathList: [],
				pathList: '',
				shoppinName: '',
				classId: '',
				methodsNum: '',
				init: '',
			}
		},
		onLoad(e) {
			console.log('跳转方法',e)
			this.methodsNum = e.item
			this.title = e.title
			this.classId = e.classId
		},
		onShow() {
			console.log('单位', this.monad)
			console.log('单位id', this.init)
		},
		methods: {
			change(e) {
				console.log(e);
			},

			goodsImage(e) {
				// this.pathList.push(e.data)
				this.pathList = e.data
				console.log('上传图片',this.pathList)
			},
			
			
			async addShopping() {
				console.log('this.classId',this.classId)
				// 使用 v-if 判断 添加商品等于 methodsNum = 2 
				// 使用 v-if 判断 编辑商品等于 methodsNum = 1
				
				// const { data: res} = await this.$u.post("api/Goods/add?name=" + this.shoppinName + "&image=" + this.pathList+"&num=" + this.num + "&unit_id=" + this.monad + "&store_id=" + this.searchVal+"&classify_id=" + this.classId);
				const res = await this.$u.post("api/jinxiao.Goods/add",{
					name: this.shoppinName,
					image: this.pathList,
					unit_id: this.init,
					classify_id:  this.classId,
				});
				if(res.code !== 1) return this.$tools.msg(res.msg)
				this.$tools.msg(res.msg)
				uni.navigateBack({
					delta: 1
				})
				console.log('请求成功',res)
				
			}
		}
	}
</script>

<style lang="scss" scoped>
	.conter {
		width: 100%;
		height: 100%;
		position: relative;
	}

	.conter-text {
		padding: 30rpx;

		.bgc {
			width: 100%;
			// height: 200rpx;
			padding: 0 30rpx;
			border-radius: 10rpx;
			background-color: #FFFFFF;

			.text-heig {
				height: 108rpx;
				line-height: 108rpx;
				display: flex;
				justify-content: space-between;
				border-bottom: 1rpx solid #F0F0F0;
			}


			.left-box {
				height: 310rpx;
				padding-top: 30rpx;

				/deep/.u-list-item.data-v-3d60ab68 {
					margin: 0 !important;
				}
			}


			.shop-heig {
				height: 144rpx;
				padding-top: 40rpx;

				view {
					margin-top: 24rpx;
					border-bottom: 1rpx solid #F0F0F0;
				}
			}
		}
	}

	.add {
		position: absolute;
		bottom: 30rpx;
		left: 50%;
		width: 90%;
		height: 90rpx;
		line-height: 90rpx;
		border-radius: 45rpx;
		transform: translateX(-50%);
		text-align: center;
		color: #FFFFFF;
		font-size: 32rpx;
	}


	.box-btn {
		height: 100rpx;
		width: 90%;
		margin: 0 auto;
		line-height: 100rpx;
		margin-top: 20rpx;
		border-top: 1rpx solid #F0F0F0;
		display: flex;
		justify-content: space-around;

		view {
			width: 50%;
			text-align: center;
			border-right: 1rpx solid #F0F0F0;
		}

		view:last-child {
			border-right: 0;
		}
	}
</style>
